<script>
import { reactive, toRefs } from "vue";

import LineChart from "@/components/Charts/LineChart.vue";
export default {
  components: { LineChart },
  setup() {
    const state = reactive({
      labelList: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
      dataList: [150, 230, 224, 218, 135, 147, 260],
      title: "出入口客流统计",
    });

    return { ...toRefs(state) };
  },
};
</script>

<template>
  <div style="display: flex; height: 50%">
    <LineChart :title="title" :labelList="labelList" :dataList="dataList" />
    <LineChart :title="title" :labelList="labelList" :dataList="dataList" />
    <LineChart :title="title" :labelList="labelList" :dataList="dataList" />
  </div>
  <div style="display: flex; height: 50%">
    <LineChart :title="title" :labelList="labelList" :dataList="dataList" />
    <LineChart :title="title" :labelList="labelList" :dataList="dataList" />
    <LineChart :title="title" :labelList="labelList" :dataList="dataList" />
  </div>
</template>

<style scoped>
</style>